import React, { Component } from 'react'
import E from 'wangeditor'
import { Button } from 'antd'

export default class Notice extends Component {

  constructor() {
    super()
    this.editor = null
    this.state = {
      content: ''
    }
  }

  componentDidMount() {
    this.editor = new E('#my-editor')
    this.editor.create()
  }

  createMarkup() {
    return {__html: this.state.content};
  }

  render() {
    return (
      <>
        <div>公告管理</div>
        <Button
          type="primary"
          onClick={() => {
            console.log(this.editor.txt.html())
            this.setState({
              content: this.editor.txt.html()
            })
          }}
        >发布</Button>
        <div id="my-editor">
          <h1>这是初始化的一级标题</h1>
          <a href="https://www.baidu.com" target="_blank" rel="noopener noreferrer">百度</a>
        </div>

        <h1>公告：</h1>
        <div dangerouslySetInnerHTML={this.createMarkup()} />
      </>
    )
  }
}
